<template>
    <div class="template-index-Lu">
        <commpVxeTable
            :key="reCommpVxeTable"
            :config="dataTableConfig"
            :columns="columnsVxe"
            :formItem="formItem"
            :occupancyHeight="occupancyHeight"
            @checkboxChange="checkboxChange"
            ref="administrativeOffice"
            @searchEvent="searchEvent"
            @resetEvent="resetEvent"
            >
            <!-- 出纳 -->
            <template  v-slot:externalOperations="{data}">
                <vxe-form-item v-if="sfkyhxShow">
                    <template>
                        <a-button class="green-btn" type="primary" @click="batchVerification()" icon="schedule">批量核销</a-button>
                    </template>
                </vxe-form-item>
                <vxe-form-item v-if="isYssbSfcw">
                    <template>
                        <a-button class="green-btn" type="primary" @click="nkjcybxAllcwFuntion()" icon="schedule">审评报销批量办理</a-button>
                    </template>
                </vxe-form-item>
                <vxe-form-item v-if="isNkjcybxSfzxld">
                    <template>
                        <a-button class="green-btn" type="primary" @click="nkjcybxAllzxldFuntion()" icon="schedule">审评报销批量办理</a-button>
                    </template>
                </vxe-form-item>
            </template>
            <!-- 财务 -->
            <!-- <template v-if="isYssbSfcw" v-slot:externalOperations="{data}">
                <vxe-form-item>
                    <template>
                        <a-button class="green-btn" type="primary" @click="nkjcybxAllcwFuntion()" icon="schedule">审评报销批量办理</a-button>
                    </template>
                </vxe-form-item>
            </template> -->
            <!-- 中心主任 -->
            <!-- <template v-if="isNkjcybxSfzxld" v-slot:externalOperations="{data}">
                <vxe-form-item>
                    <template>
                        <a-button class="green-btn" type="primary" @click="nkjcybxAllzxldFuntion()" icon="schedule">审评报销批量办理</a-button>
                    </template>
                </vxe-form-item>
            </template> -->
            <template v-slot:operation_fsqr="{row}" data-desc="申请人">
                <span style="padding-right: 21;" v-if="row.fsqr.length == 2">
                    <span v-for="(trem,tI) in row.fsqr.split('')" :key="tI" >
                        {{trem}}
                        <span v-if="tI+1 !== row.fsqr.split('').length">&nbsp;&nbsp;</span>
                    </span>
                </span>
                <span style="padding-right: 21;" v-else>{{ row.fsqr }}</span>
            </template>
            <template v-slot:operation_btn="{row}" data-desc="自定操作栏">
                <a-form layout="inline">
                    <a-form-item>
                        <a-button class="blue-btn" @click="reviseClick(row)">办理</a-button>
                    </a-form-item>
                </a-form>
            </template>
        </commpVxeTable>
        <handleModal ref="handleModalRef" @resetEvent="resetEvent"></handleModal>
    </div>
</template>
<script>
import  commpVxeTable   from '@/components/commp-vxe-table/commp-vxe-table.vue'
import handleModal from '../modal/handleModal'
import {
    queryByJodId,
    nkBatchVerification,
    nkSfkyhx,
    nkjcybxAllcw,
    nkjcybxAllzxld,
    yssbSfcw,
    nkjcybxSfzxld,
} from './service/index'
import YchConstant from "@/api/YchConstant";
import store from '@/store/'
export default {
    props: {
        occupancyHeight: {
            type:Number,
            default: 0,
            requrie: false,
        }
    },
    components: {
        commpVxeTable,
        handleModal
    },
    data() {
        return {
            reCommpVxeTable: '',
            url: {
                list:YchConstant.SPZX_OA + '/newflow-lgqs/flowJobPage',// 离岗请示-分页查询列表
                list_url: YchConstant.PREFIX_EFORM + '/manage/actAppHelp/list',
                delete_url: YchConstant.PREFIX_EFORM + '/manage/actAppHelp/delete',
                sync_url: YchConstant.PREFIX_EFORM + '/manage/actAppHelp/sync',
                uploadHelps_url: YchConstant.PREFIX_EFORM + '/manage/actAppHelp/upload',
            },
            dataTableConfig: {
                api: YchConstant.SPZX_OA + '/mydbyb/NkDbList',
                rowId: 'id',
                urlType: true,
                paramet: {}
            },
            columnsVxe: [
                {
                    type: 'checkbox',
                    width: 60 ,
                    fixed: 'left'
                },{
                    title: '单据号',
                    field: 'fdjh',
                    width: 200,
                },{
                    title: '标题',
                    field: 'fbt',
                    // width: 100,
                    titleInterval:true,
                    slots: {
                        header:'data1_header',
                    }
                },{
                    title: '摘要',
                    field: 'fzy',
                    align:'left',
                    titleInterval:true,
                    slots: {
                        header:'data1_header',
                    }
                },{
                    title: '发起人',
                    field: 'fsqr',
                    width: 80,
                    interval:true,
                    slots: {
                        default:'operation_fsqr',
                    }
                },{
                    title: '发送时间',
                    field: 'fsqsj',
                    width: 150,
                },{
                    title: '环节名称',
                    field: 'fhjmc',
                    width: 200,
                },{
                    title: '操作',
                    field: 'jobid',
                    width: 100,
                    titleInterval:true,
                    slots: {
                    // 使用插槽模板渲染
                        header:'data3_header',
                        default: 'operation_btn',
                    },
                }
            ],
            formItem: [
                {
                    label: '申请人',
                    model: 'fsqr',
                },{
                    label: '单据号',
                    model: 'fdjh',
                },{
                    label: '摘要关键字',
                    model: 'fzy',
                },
                // {
                //     label: '报销类型',
                //     model: 'flcmb',
                //     type:'Select',
                //     options:[{
                //         label:'差旅报销',
                //         value:'差旅报销'
                //     },{
                //         label:'一般报销',
                //         value:'一般报销'
                //     }]
                // },
            ],
            jobidList: [],
            formData: {},
            sfkyhxShow: false,
            templateIndexKey: '',
            isYssbSfcw: false,
            isNkjcybxSfzxld: false,
        }
    },
    mounted() {
        this.getnkSfkyhx()
        this.yssbSfcwFuntion()
        this.nkjcybxSfzxldFuntion()
    },
    methods: {
        // 勾选
        checkboxChange(val){
            //console.log('已选择',val)
            this.jobidList = []
            if(val.length){
                val.forEach(item => {
                    this.jobidList.push(item.jobid)
                });
            }
        },
        // 搜索
        searchEvent(){
            this.dataTableConfig.paramet = {
                ...this.dataTableConfig.paramet,
            }
        },
        // 重置
        resetEvent(){
            //console.log('重置')
            this.reCommpVxeTable = Date.now()
            this.dataTableConfig.paramet = {
                ...this.dataTableConfig.paramet,
            }
        },
        // 点击办理
        reviseClick(row){
            //console.log(row)
            let data = {
                jobId: row.jobid,
                lcmbbm: row.flcmb,
                fpid: row.fpid,
            }
            if(row.fblzt == '退回' && row.fhjmc == '填写报销单'){
                let refName = ''
                if(row.fbxlx == '一般报销'){
                    refName = 'yiBanBaoXiaoModalRef'
                } else if(row.fbxlx == '差旅报销'){
                    refName = 'addBaoXiaoModalRef'
                } else if(row.fbxlx == '审评员报销'){
                    this.$refs.handleModalRef.reimburseClick({fsqsxid:'',bxdid: row.fpid})
                    return
                }
                let data = {
                    id: row.fpid
                }
                this.$refs.handleModalRef.applicationClick(data,refName)
                return
            }
            queryByJodId(data).then(res => {
                //console.log(res)
                if(res.code == 200){
                    this.$nextTick(_ => {
                        this.$refs.handleModalRef.modalClick(res.result)
                    })
                }
            })
        },
        getnkSfkyhx(){
            nkSfkyhx().then(res => {
                this.sfkyhxShow = res.result
                this.$refs.administrativeOffice = Date.now
            })
        },
        yssbSfcwFuntion(){
            yssbSfcw().then(res => {
                this.isYssbSfcw = res.result
                this.$refs.administrativeOffice = Date.now
            })
        },
        nkjcybxSfzxldFuntion(){
            nkjcybxSfzxld().then(res => {
                this.isNkjcybxSfzxld = res.result
                this.$refs.administrativeOffice = Date.now
            })
        },
        // 批量核销
        batchVerification(){
            //console.log(store.getters)
            // //console.log(this.jobidList.toString())
            // //console.log((this.jobidList.toString()).split(','))
            if(this.jobidList.length <= 0){
                this.$message.warning('请勾选批量核销数据')
            } else {
                let that = this
                this.$confirm({
                    title:'您确认要批量核销吗？',
                    onOk() {
                        let data = that.jobidList.toString()
                        //console.log('data:',data)
                        nkBatchVerification({jobids:data}).then(res => {
                            if(res.success){
                                that.$message.success(res.message)
                                that.reCommpVxeTable = Date.now()
                            } else {
                                that.$message.warning(res.message)
                            }
                        })
                    }
                })
            }
        },
        // 批量核销-财务
        nkjcybxAllcwFuntion(){
            //console.log(store.getters)
            if(this.jobidList.length <= 0){
                this.$message.warning('请勾选批量办理数据')
            } else {
                let that = this
                this.$confirm({
                    title:'您确认要批量同意办理吗？',
                    onOk() {
                        let data = that.jobidList.toString()
                        //console.log('data:',data)
                        nkjcybxAllcw({jobids:data}).then(res => {
                            if(res.success){
                                that.$message.success(res.message)
                                that.reCommpVxeTable = Date.now()
                            } else {
                                that.$message.warning(res.message)
                            }
                        })
                    }
                })
            }
        },
        // 批量核销-中心主任
        nkjcybxAllzxldFuntion(){
            //console.log(store.getters)
            if(this.jobidList.length <= 0){
                this.$message.warning('请勾选批量办理数据')
            } else {
                let that = this
                this.$confirm({
                    title:'您确认要批量同意办理吗？',
                    onOk() {
                        let data = that.jobidList.toString()
                        //console.log('data:',data)
                        nkjcybxAllzxld({jobids:data}).then(res => {
                            if(res.success){
                                that.$message.success(res.message)
                                that.reCommpVxeTable = Date.now()
                            } else {
                                that.$message.warning(res.message)
                            }
                        })
                    }
                })
            }
        },
    },
}
</script>
